<template>
	<w-app-container>
		<fx-page-header title="工序"></fx-page-header>
    <w-app-container direction="row" class="fx-page-first-container">
			<treeContainer
				ref="treeContainer"
				@on-tree-item-click="initProduceList"
			></treeContainer>
			<listContainer
				ref="listContainer"
				@on-refresh="initProduceList"
        @on-create="onCreate"
				@on-edit="onEdit"
				:getCurrentNode="getCurrentTreeNode"
			></listContainer>
      <createContainer ref="createContainer" @on-refresh="initProduceList"></createContainer>
		</w-app-container>
	</w-app-container>
</template>
<script>
import treeContainer from '@/components/tree-container/tree-produceType/Index.vue'
import listContainer from './components/list-container/Index.vue'
import createContainer from './components/create-container/Index.vue'
export default {
	name: 'produce',
	components: {
		treeContainer,
		listContainer,
		createContainer
	},
	mounted () {
		this.initTree()
	},
	methods: {
		initTree () {
			this.$refs.treeContainer.getTreeData().then(this.initProduceList)
		},
		initProduceList () {
			this.$refs.listContainer.refresh()
		},
		getCurrentTreeNode () {
			return this.$refs.treeContainer.getCurrentNode()
		},
		onCreate (item) {
			this.$refs.createContainer.add()
		},
		onEdit (procedureDetails) {
			this.$refs.createContainer.edit(procedureDetails)
		}
	}
}
</script>
